/*内容部分总体颜色*/
.middle , .middle > div:first-child {
    display: flex;
    flex-direction: column;
    align-items: center;
}

/*内容部分第一个div的css样式*/
.middle > div:first-child {
    width: 100%;
    background-color: rgb(236, 236, 236);
}

/*内容部分第一个div中的div容器之间相互间隔1em*/
.middle > div:first-child > div {
    margin: 1em;
}

/*内容部分第一个div中的div容器中的样式*/
/*公司简介*/
.middle > div:first-child > div:first-child , .middle > div:nth-child(2) > div:first-child , .middle > div:last-child > div:first-child{
    font-size: 1.6em;
    font-weight: bolder;
    font-family: 黑体;
    text-align: center;
    color: rgb(22, 132, 77);
    cursor: pointer;
    /*border: 3px solid red;*/
}
/*鼠标停留在公司简介上变色*/
.middle > div:first-child > div:first-child:hover , .middle > div:nth-child(2) > div:first-child:hover ,.middle > div:last-child > div:first-child:hover {
    color: rgb(239, 43, 29);
}

/*设置内容部分中的第一个div中的最后一个div的布局方式为flex布局*/
/*图片+公司简介的内容*/
.middle > div:first-child > div:last-child {
    display: flex;
}

.middle > div:first-child > div:last-child > div {
    margin: 0 1em;
}

/*公司简介内容*/
.middle > div:first-child > div:last-child > div:last-child > div:first-child > div {
    margin: 0.2em;
    color: rgb(22, 132, 77);
}

/*详情*/
.middle > div:first-child > div:last-child > div:last-child > div:last-child {
    text-align: center;
    font-family: Arial;
    padding: 2px;
    color: rgb(242, 255, 255);
    margin-left: 80%;
    background-image: url("../img/11_r1jc.png");
    background-size: 100% 100%;
    cursor: pointer;
}

/*middle容器的第二部分（产品展示部分）*/
.middle > div:nth-child(2) {
    width: 100%;
    background-color: rgb(255, 255, 255);
    display: flex;
    flex-direction: column;
    align-items: center;
}

/*两图片的外边距*/
.middle > div:nth-child(2) > div {
    margin: 1em;
}

/*装图片的容器*/
.middle > div:nth-child(2) > div:last-child {
    display: flex;
}

/*该容器内div样式*/
.middle > div:nth-child(2) > div:last-child > div {
    margin: 0 2em;
}

/*四川全省网吧并入监控玩低俗游戏*/
.middle > div:nth-child(2) > div:last-child > div:first-child > div:last-child ,.middle > div:nth-child(2) > div:last-child > div:last-child > div:last-child {
    background-image: url("../img/11_r1jc.png");
    background-size: 100% 100%;
    padding: 1em;
    text-align: right;
    color: rgb(242, 255, 255);
    cursor: pointer;
}

.middle > div:nth-child(2) > div:last-child > div:first-child > div:last-child:hover ,.middle > div:nth-child(2) > div:last-child > div:last-child > div:last-child:hover{
    color: rgb(109,207,152);
}
/*middle容器第三部分（产品展示）*/
.middle > div:last-child {
    width: 100%;
    background-color: rgb(255, 255, 255);
    display: flex;
    flex-direction: column;
}

.middle > div:last-child > div {
    margin: 1em 0;
}

.middle > div:last-child > div:last-child {
    display: flex;
}

.middle > div:last-child > div:last-child > div:first-child {
    width: 40%;
    background-color: rgb(62, 62, 62);
}

/*图片轮播部分*/
.middle > div:last-child > div:last-child > div:first-child > div:first-child {
    margin: 10% 8% 5% 40%;
    /*border: 3px solid red;*/
}

/*畅销产品*/
.middle > div:last-child > div:last-child > div:first-child > div:last-child {
    background-image: url("../img/11_r1jc.png");
    background-size: 100% 100%;
    margin: 0 8% 5% 55%;
    padding: 2% 3% 1% 0;
    text-align: right;
    color: rgb(255, 255, 255);
    cursor: pointer;
}

/*科学技术本质的概括*/
.middle > div:last-child > div:last-child > div:last-child {
    margin-left: 10%;
    width: 40%;
}

.middle > div:last-child > div:last-child > div:last-child > div {
    margin-top: 1em;
}

.middle > div:last-child > div:last-child > div:last-child > div:first-child {
    font-size: 1.5em;
    color: rgb(154, 154, 154);
}

.middle > div:last-child > div:last-child > div:last-child > div:nth-child(2) {
    color: rgb(154, 154, 154);
}

/*详情按钮*/
.middle > div:last-child > div:last-child > div:last-child > div:last-child {
    text-align: center;
    font-family: Arial;
    padding: 2px;
    color: rgb(242, 255, 255);
    margin-right: 25%;
    margin-left: 60%;
    background-image: url("../img/11_r1jc.png");
    background-size: 100% 100%;
    cursor: pointer;
}

.top > div:first-child > div:last-child > div:last-child > a:first-child {
    color: rgb(123, 207, 152);
}

/*图片轮播具体实现*/
#container {
    width: 296px;
    height: 143px;
    overflow: hidden;
}

#photo {
    height: 429px;
    animation: switch 5s ease-out infinite;
}

#photo > img {
    float: top;
    width: 296px;
    height: 143px;
}

@keyframes switch {
    0%, 25% {
        margin-top: 0;
    }
    35%, 60% {
        margin-top: -143px;
    }
    70%, 100% {
        margin-top: -286px;
    }
}
